import 'package:flutter/material.dart';
import 'package:flutter_demo/widget/tiny_widgets.dart';

class SearchWidget extends StatefulWidget {

  final TextEditingController controller = TextEditingController();
  final String hintText;
  final bool autofocus;
  final Function()? onClickCallback;
  final Function()? onFocusCallback;
  final Function(String content)? onSearchCallback;

  SearchWidget(
      {Key? key,
        required this.hintText,
        this.autofocus = false,
        this.onClickCallback,
        this.onFocusCallback,
        this.onSearchCallback,
      }) : super(key: key);

  @override
  State<SearchWidget> createState() => _SearchState();
}

class _SearchState extends State<SearchWidget> {

  FocusNode focusNode = FocusNode();

  @override
  void initState() {
    super.initState();
    focusNode.addListener(onFocusChange);
  }

  @override
  void dispose() {
    super.dispose();
    focusNode.removeListener(onFocusChange);
  }

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: widget.onClickCallback,
      child: Container(
        height: 44,
        alignment: Alignment.centerLeft,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(6),
          color: Colors.white,
        ),
        child: Row(
          children: [
            Padding(
              padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
              child: Icon(
                Icons.search,
                color: Colors.black45,
                size: 24,
              ),
            ),
            Container(
              height: 24,
              width: 1,
              color: Color(0xffededed),
            ),
            C(7),
            Expanded(
              child: Center(
                child: TextField(
                  enabled: widget.onClickCallback != null ? false : true,
                  textInputAction: TextInputAction.done,
                  controller: widget.controller,
                  autofocus: widget.autofocus,
                  focusNode: focusNode,
                  autocorrect: false,
                  style: TextStyle(
                    fontSize: 16,
                  ),
                  decoration: InputDecoration(
                    hintText: widget.hintText,
                    isDense: true,
                    border: InputBorder.none,
                    focusedBorder: InputBorder.none,
                    enabledBorder: InputBorder.none,
                    errorBorder: InputBorder.none,
                    disabledBorder: InputBorder.none,
                    hintStyle: TextStyle(
                      color: Colors.black45,
                      fontSize: 14,
                    ),
                  ),
                  onSubmitted: (content) => widget.onSearchCallback?.call(content),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  void onFocusChange() {
    widget.onFocusCallback?.call();
  }
}